<script setup lang="ts">
import ThreeShow from './components/ThreeShow/index.vue'
import { provide, ref } from 'vue'

//预览3d模型文件
const iSThreeDialog = ref<boolean>(false) //预览控制
const url3D = ref<string>() //3d预览地址
const openThreeDialog = (val: string) => {
  url3D.value = val
  iSThreeDialog.value = true
}
//关闭预览
const gb = () => {
  iSThreeDialog.value = false
}
// 暴露方法
provide('index_gb', gb)
</script>

<template>
  <el-button type="primary" @click="openThreeDialog('/3D/room1.glb')"
    >打开3D模型</el-button
  >
  <ThreeShow v-if="iSThreeDialog" :url1="url3D" />
</template>

<style scoped>
.logo {
  height: 6em;
  padding: 1.5em;
  will-change: filter;
  transition: filter 300ms;
}
.logo:hover {
  filter: drop-shadow(0 0 2em #646cffaa);
}
.logo.vue:hover {
  filter: drop-shadow(0 0 2em #42b883aa);
}
</style>
